@headerHeight: 44px;
@footHeight: 0;

.responsive-design {
  position: relative;
  width: 100vw;
  height: 100vh;
  background-color: #f2f5f7;

  .logo-bar {
    position: fixed;
    top: 0;
    height: @headerHeight;
    width: 100%;
    background-color: #fff;
    box-shadow: 0 0 10px 0 rgba(0,0,0,.2);
    .container {
      margin: auto;
      padding: 0 20px;
      height: 100%;
      max-width: 1440px;
      box-sizing: border-box;
      #mdn-docs-logo {
        width: 154px;
        height: 24px;
        outline: none;
        transform: translate(0,12px) scale(1.16);
      }
    }
  }

  main {
    padding-top: @headerHeight;
    padding-bottom: @footHeight;
    height: 100vh;
    box-sizing: border-box;
  }
}